<html>
  <head>
    <title>Simple WebSerivice</title>
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
	<link rel="stylesheet" href="./lib/jquery.mobile-1.1.1.min.css" />
	<script src="./lib/jquery-1.7.1.min.js"></script>
	<script src="./lib/jquery.mobile-1.1.1.min.js"></script>
   <script src="./lib/jquery.js" ></script>
   <script language="JavaScript" SRC="config.js"></script>
   <script language="JavaScript" SRC="config.js"></script>
    <script type="text/javascript" charset="utf-8">
    function loadDataPro(){
  alert("loadData are called");
 // $.getJSON("http://10.0.2.2/socialengine/mobileservice/hello?callback=?",
   $.getJSON('http://'+serverip+'/socialengine/mobileservice/systemmode/production?callback=?',
   function(data){
    alert(data.Contact[1].Detail); // hellothisisbob@gmail.com
  });
 }
 function loadDataDev(){
  alert("loadData are called");
 // $.getJSON("http://10.0.2.2/socialengine/mobileservice/hello?callback=?",
   $.getJSON('http://'+serverip+'/socialengine/mobileservice/systemmode/development?callback=?',
   function(data){
    alert(data.Contact[1].Detail); // hellothisisbob@gmail.com
  });
 }
    </script>
  </head>
<body>
<div data-role="page">
	<div data-role="header">
	<a href="index.html" data-role="button" data-icon="home" data-iconpos="notext" rel="external">Home</a>
		<h1>Change Mode</h1>
	</div><!-- /header -->
	<div data-role="content">	
  	<input type="button" value="Production Mode" onclick="loadDataPro();" />
   	<input type="button" value="Development Mode" onclick="loadDataDev();" />
   	</p>		
	</div><!-- /content -->

</div><!-- /page -->
 </body>
</html>